<template>
	<div>
		<el-dialog
		        :title="addTitle"
				@close="$emit('confirm')"
				:close-on-click-modal="false"
		        :visible.sync="formShow"
		        width="1000px"
		>
		  <div>
			  <el-form ref="form" label-width="80px">
				  <div class="flex flex_b">
					  <el-form-item label="品牌名称" >
							<!-- <el-input size="small"
							  disabled
							  v-if="form.id"
							  v-model="form.brand_name"
							></el-input> -->
					  		<selectBrand 
							ref="selectBrand1" 
							@getBrandName="getBrandName1" />
					  </el-form-item>
					  <el-form-item label="系列名称">
						  <!-- <el-input size="small"
							disabled
							v-if="form.id"
							v-model="form.class_name"
						  ></el-input> -->
					  	   <selectSerial  
							ref="selectSerial1" 
							@getClassName="getClassName1" />
					  </el-form-item>
					  <el-form-item label="型号名称">
							 <el-input size="small" 
								v-model="form.model_name"
							 ></el-input>
					  </el-form-item>
				  </div>
				  <div class="flex flex_b">
					  <el-form-item label="排序" >
						  <el-input size="small"
							type="number"
							v-model="form.sort"
						  ></el-input>
					  </el-form-item>
					  <el-form-item label="型号说明" >
						<el-input type="textarea" size="small" v-model="form.model_remark"
						></el-input>
					  </el-form-item>
					  <el-form-item label="串号长度" >
						  <el-input size="small"
							type="number"
							v-model="form.number_length"
						  ></el-input>
					  </el-form-item>
				  </div>
				  <div class="flex" 
						v-if="!form.id"
						v-for="(el,i) in addGoodsData" :key="i">
					  <el-form-item label="内存">
							<div  >
								<el-input size="small"
									@input="changeWeight(el,i)"
									style="width: 100px;"
									v-model="el.goods_weight"
								></el-input>
							</div>
					  </el-form-item>
					  <el-form-item label="排序">
							<div >
								<el-input size="small"
									type="number"
									style="width: 80px;"
									v-model="el.sort"
								></el-input>
							</div>
					  </el-form-item>
					  <el-form-item label="名称">
							<div >
								<el-input size="small"
									style="width: 200px;"
									v-model="el.goods_outher_name"
								></el-input>
							</div>
					  </el-form-item>
					  <el-form-item label="颜色">
						   <div >
							  <el-input size="small" v-model="el.goods_color_str"
								style="width: 200px;"
								placeholder="多个颜色用空格隔开"
							  ></el-input>
							  <i style="font-size: 25px;cursor: pointer;position: relative;top: 5px;left: 5px;" 
									@click="addGoodsItem"
									class="el-icon-circle-plus-outline"></i>
							  <i style="font-size: 25px;cursor: pointer;position: relative;top: 5px;left: 10px;"
									@click="removeGoodsItem(i)"
									class="el-icon-remove-outline"></i>
						   </div>
					  </el-form-item>
				  </div>
				  <el-form-item >
				      <el-button type="primary" @click="confirm" size="small">确定</el-button>
				  </el-form-item>
			  </el-form>
		  </div>
		</el-dialog>
	</div>
</template>

<script>
	import selectModel from '@/components/selectModel.vue'
	import selectSerial from '@/components/selectSerial.vue'
	import selectBrand from '@/components/selectBrand.vue'
	export default {
		components:{
			selectModel,
			selectSerial,
			selectBrand
		},
		data(){
			return {
				form:{
					id:null,
					model_remark:'',
					model_name:"",
					brand_name:"",
					class_name:'',
					old_model_name:"",
					old_brand_name:"",
					old_class_name:'',
					sort:1,
					number_length:1
				},
				addTitle:'新增',
				isShow:false,
				table_name:'hs_model',
				memopryData:{
					model_name:"",
					brand_name:"",
					class_name:'',
				},
				memoryArr:[], //内存数据
				addGoodsData:[
					{
						goods_weight:'',
						goods_color_str:'',
						sort:1,
						goods_outher_name:""
					}
				],
				formShow:true
			}
		},
		
		methods:{
			changeWeight(el,i){
				this.addGoodsData[i].goods_outher_name = `${this.form.brand_name} ${this.form.model_name} ${el.goods_weight}`
			},
			removeGoodsItem(i){
				if(this.addGoodsData.length==1) return this.$message.error('只剩一个不能删除')
				this.addGoodsData.splice(i,1)
			},
			addGoodsItem(){
				this.addGoodsData.push({
					goods_weight:'',
					goods_color_str:'',
					sort:1,
					goods_outher_name:""
				})
			},
			getModelName(val){
				this.search_form.model_name = val
			},
			getClassName(val){
				this.search_form.class_name = val
				this.form.class_name = val
				this.$refs.selectModel.lodeModel(val)
			},
			getClassName1(val){
				this.form.class_name = val
			},
			getBrandName(val){
				this.search_form.brand_name = val
				this.form.brand_name = val
				this.$refs.selectSerial.lodeClass(val)
			},
			getBrandName1(val){
				this.form.brand_name = val
				this.$refs.selectSerial1.lodeClass(val)
			},
			confirm(){
				if(this.form.id){
					this.$post('/prodectSys/editModel',this.form,res=>{
						if(res.data.code==200){
							this.$message.success('操作成功')
							this.formShow = false
							this.$emit('confirm')
						}
					})
				}else{
					this.addGoods()
				}
			},
			addGoods(){
				let goodsInfo = []
				for(let item of this.addGoodsData){
					item.goods_color_arr = item.goods_color_str.split(' ')
					for(let ele of item.goods_color_arr){
						let obj = {
							brand:this.form.brand_name,
							cate:this.form.class_name,
							cid:sessionStorage.getItem('cid'),
							goods_color:ele,
							goods_name:`${this.form.brand_name} ${this.form.model_name} ${item.goods_weight} ${ele}`,
							goods_outher_name:item.goods_outher_name,
							goods_type:this.form.model_name,
							goods_weight:item.goods_weight,
							sort:item.sort,
							number_length:this.form.number_length,
							is_price:1
						}
						goodsInfo.push(obj)
					}
				}
				let params = {
					model_info:this.form,
					goods_info:goodsInfo
				}
			    
				this.$post('/prodectSys/addGoodsModel',params,res=>{
					if(res.data.code==200){
						this.$message.success('操作成功')
						this.formShow = false
						this.$emit('confirm')
					}
				})
			},
		},
		
	}
</script>

<style>
</style>